import { createRouter, createWebHistory } from "vue-router";
import store from "@store/index";

const router = createRouter({
   history: createWebHistory(import.meta.env.BASE_URL),
   routes: [
      { path: "/", redirect: "/data" },

      // {
      //    path: "/about",
      //    name: "about",
      //    // route level code-splitting
      //    // this generates a separate chunk (About.[hash].js) for this route
      //    // which is lazy-loaded when the route is visited.
      //    component: () => import("../views/AboutView.vue"),
      // },

      /* demos */
      {
         path: "/demos",
         name: "demos",
         meta: { menuIndex: "4" },
         component: () => import("@demos/Index.vue"),

         children: [
            {
               path: "element",
               name: "element",
               component: () => import("@demos/ElementDemo.vue"),
            },
            {
               path: "vuex",
               name: "vuex",
               component: () => import("@demos/VuexDemo.vue"),
            },
         ],
      },

      /* 数据看板 */
      {
         path: "/data",
         name: "data",
         meta: { menuIndex: "0" },
         component: () => import("../views/DashBoard.vue"),
      },

      /* 正在热映 */
      {
         path: "/film/playing",
         name: "playing",
         meta: { menuIndex: "1-0" },
         component: () => import("../views/film/Playing.vue"),
      },

      /* 即将上映 */
      {
         path: "/film/coming",
         name: "coming",
         meta: { menuIndex: "1-1" },
         component: () => import("../views/film/Coming.vue"),
      },

      /* 热门城市 */
      {
         path: "/cinema/hot",
         name: "hot",
         // 当前路由的访问需要管理员权限
         meta: { menuIndex: "2-0-0", adminRequired: true },
         component: () => import("../views/cinema/HotCity.vue"),
      },

      /* 所有城市 */
      {
         path: "/cinema/all",
         name: "allcity",
         // 当前路由的访问需要管理员权限
         meta: { menuIndex: "2-1", adminRequired: true },
         component: () => import("../views/cinema/AllCity.vue"),
      },

      /* 用户管理 */
      {
         path: "/user",
         name: "user",
         meta: { menuIndex: "3" },
         component: () => import("../views/UserList.vue"),
      },

      {
         path: "/film/:id([a-z\\d]{24})",
         name: "detail",
         component: () => import("../views/film/Detail.vue"),
      },

      {
         path: "/film/add",
         name: "filmadd",
         component: () => import("../views/film/DetailAdd.vue"),
      },

      {
         path: "/login",
         name: "login",
         meta: { hidePageHeader: true },
         component: () => import("../views/Login.vue"),
      },

      /* 404 */
      {
         path: "/:pm(.*)*",
         name: "notfound",
         component: () => import("@views/NotFound.vue"),
      },
   ],
});

router.beforeEach((to, from, next) => {
   if (to.meta.adminRequired) {
      // 是管理员就放行
      if (store.state.user && store.state.user.admin) {
         next();
      } else {
         // 否则踹到登录页
         next({ name: "login" });
      }
   } else {
      // 不需要管理员权限直接放行
      next();
   }
});

export default router;
